<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Exercise 3.05</title>
    <style>
      .product-card {
        display: inline-block;
        border: 1px solid black;
        padding: 15px;
      }

      .product-card img {
        width: 100%;
      }

      .product-card h2 {
        margin: 30px 0 15px;
      }

      .product-card a {
        color: black;
        text-decoration: none;
      }

      .product-card p {
        line-height: 1.5;
      }

      .original-price {
        color: gray;
        text-transform: uppercase;
      }

      .current-price span {
        font-weight: bold;
        text-decoration: underline;
      }

      .saving {
        color: green;
      }
    </style>
  </head>

  <body>
    <div class="product-card">
      <img
        src="https://dummyimage.com/300x300/7EC0EE/000&text=Product+Image+1"
        alt="Product image 1"
      />
      <h2><a href="">Video title 1</a></h2>
      <p class="original-price">RRP: £18.99</p>
      <p class="current-price">Price you pay <span>£9.99</span></p>
      <p class="saving">Your saving £9</p>
    </div>
  </body>
</html>
